<template>
  <div class="page">
    <div class="page-bd">
      <!-- 面包屑导航 -->
      <el-row type="flex" justify="space-between" class="breadcrumb">
        <div>
          <img src="~@/assets/images/programme-home.png" class="icon-home">
          <span style="margin-right: 25px;">{{ $route.meta.title }}</span>
          <span>管理方案</span>
          <span style="margin-left: 5px;margin-right: 5px;">></span>
          <span>设计方案</span>
          <span style="margin-left: 5px;margin-right: 5px;">></span>
          <span>{{ studentInfo[0].batch }}</span>
        </div>
        <el-row type="flex" align="middle">
          <span>{{ user.name }}</span>
          <span style="margin: 0 33px;">{{ user.sex == 0 ? "男" : "女" }}</span>
          <span style="margin: 0 5px;">
            <span v-if="studentInfo[0].majorType == 1">物理</span>
            <span v-if="studentInfo[0].majorType == 2">历史</span>
          </span>
					<span style="margin: 0 5px;">{{ user.subject1 }}</span>
					<span style="margin: 0 5px;">{{ user.subject2 }}</span>
					<span style="margin: 0 5px;" v-if="user.score">分数:{{ user.score }}</span>
					<span style="margin: 0 5px;" v-if="user.precedence">位次:{{ user.precedence }}</span>
        </el-row>
      </el-row>
      <div class="page-block">
        <!-- tabs -->
        <el-row type="flex">
          <!-- 理科: 理科、艺术理 文史: 文史、艺术文  -->
					<div class="queryParams-row1" style="margin-right: 50px;">
						<span class="queryParams-row1__label">首选科目</span>
						<el-radio-group v-model="queryParams.schoice" class="queryParams-row1__group">
							<el-radio label="W" :disabled="queryParams.schoice != 'W'">物理</el-radio>
							<el-radio label="L" :disabled="queryParams.schoice != 'L'" >历史</el-radio>
						</el-radio-group>
					</div>
					<div class="queryParams-row1">
						<span class="queryParams-row1__label">再选科目</span>
						<el-checkbox-group v-model="queryParams.subject" :max="2" class="queryParams-row1__group">
							<el-checkbox :disabled="true" v-for="item in secondarilySubjects" :label="item.value" :key="item.value">
								{{ item.label }}
							</el-checkbox>
						</el-checkbox-group>
					</div>

          <el-tabs class="ui-tabs" @tab-click="getTableData" v-model="tabs.active" style="flex: 1; min-width: 0;">
            <el-tab-pane disabled v-for="item in tabs.list" :key="item.id" :label="item.label" :name="item.value">
							<span slot="label">
								{{ item.label }}
							</span>
            </el-tab-pane>
          </el-tabs>
<!--					<el-button @click="onClickShowPrecedenceDialog" size="medium" type="primary">位次查询</el-button>-->
        </el-row>
				<div v-if="tabs.active.indexOf('本科普通批平行') !== -1" style="margin-bottom: 0;" class="chooseBlock-cell">
					<span class="chooseBlock-cell__label">招生类别</span>
					<el-checkbox-group class="ui-tbHeaderForm-elCheckbox" v-model="queryParams.recruitType">
						<el-checkbox v-for="item in recruitTypeList" :key="item.value"
							:disabled="recruitType.default.includes(item.value)" :label="item.value"
							@change="onClickChooseBlockItem(item.label, 'recruitType');getTableData()"
							>
							{{ item.label }}
						</el-checkbox>
					</el-checkbox-group>
				</div>
				<!-- input搜索区 -->
				<div style="padding-top: 10px;" class="ui-tbHeaderForm-searchCells">
					<div class="ui-tbHeaderForm-searchCell">
						<span class="ui-tbHeaderForm-searchCell__label" style="margin-right: 15px;">院校名称</span>
						<el-autocomplete style="width: 160px;" class="ui-tbHeaderForm-searchCell__value" v-model="queryParams.school"
							@blur="schoolBoolen = true" @focus="schoolBoolen = false" :fetch-suggestions="querySchoolSearch" @select="querySchoolGroupCode"
							placeholder="请输入内容" :trigger-on-focus="false">
						</el-autocomplete>
						<el-select class="ui-tbHeaderForm-searchCell__value" style="width: 80px;;padding-left: 10px;" :clearable="true" v-model="queryParams.checkGroupCode" placeholder="请选择" >
							<el-option v-for="item in checkGroupCodeList"
												 :key="item.value"
												 :label="item.label"
												 :value="item.value">
							</el-option>
						</el-select>
					</div>
					<div style="flex-shrink: 0; display: flex;">
						<div class="ui-tbHeaderForm-searchCell">
							<span class="ui-tbHeaderForm-searchCell__label">专业1</span>
							<el-autocomplete class="ui-tbHeaderForm-searchCell__value" v-model="queryParams.major1" :fetch-suggestions="queryMajorSearch"
								placeholder="请输入专业名称" :trigger-on-focus="false" style="width: 160px;">
							</el-autocomplete>
						</div>
						<div class="ui-tbHeaderForm-searchCell">
							<span class="ui-tbHeaderForm-searchCell__label">专业2</span>
							<el-autocomplete class="ui-tbHeaderForm-searchCell__value" v-model="queryParams.major2" :fetch-suggestions="queryMajorSearch"
								placeholder="请输入专业名称" :trigger-on-focus="false" style="width: 160px;">
							</el-autocomplete>
						</div>
						<div class="ui-tbHeaderForm-searchCell">
							<span class="ui-tbHeaderForm-searchCell__label">专业3</span>
							<el-autocomplete class="ui-tbHeaderForm-searchCell__value" v-model="queryParams.major3" :fetch-suggestions="queryMajorSearch"
								placeholder="请输入专业名称" :trigger-on-focus="false" style="width: 160px;">
							</el-autocomplete>
						</div>
						<div class="ui-tbHeaderForm-searchCell">
							<span class="ui-tbHeaderForm-searchCell__label">分数</span>
							<el-input class="ui-tbHeaderForm-searchCell__value" placeholder="请输入分数" style="width: 100px;" v-model="queryParams.fraction" :disabled="tqfrom"
								@input="Ipt(1)"></el-input>
						</div>
						<div class="ui-tbHeaderForm-searchCell">
							<span class="ui-tbHeaderForm-searchCell__label">位次</span>
							<el-input class="ui-tbHeaderForm-searchCell__value" placeholder="请输入位次" style="width: 100px;" v-model="queryParams.precedence" :disabled="tqfrom"
								@input="Ipt(2)"></el-input>
              <i class="el-icon-warning-outline" style="margin-left: 10px;font-size: 18px;color: #f96630;cursor: pointer" @click="onClickShowPrecedenceDialog"></i>
						</div>
					</div>
				</div>
        <section class="collapse">
          <div class="chooseBlock" :class="{ 'chooseBlock-close': collapseOpen === false }">
            <div class="chooseBlock-cell">
              <span class="chooseBlock-cell__label">所在省份</span>
              <el-checkbox-group class="ui-tbHeaderForm-elCheckbox" v-model="queryParams.checkedCities">
                <el-checkbox v-for="item in cities" :label="item.value" :key="item.value"
									@change="onClickChooseBlockItem(item.label, 'checkedCities')">
									{{ item.label }}
								</el-checkbox>
              </el-checkbox-group>
            </div>
            <div class="chooseBlock-cell">
              <span class="chooseBlock-cell__label">院校类型</span>
              <el-checkbox-group class="ui-tbHeaderForm-elCheckbox" v-model="queryParams.checkedSchoolTypes">
                <el-checkbox v-for="item in SchoolTypes" :label="item.value" :key="item.value"
									@change="onClickChooseBlockItem(item.value, 'checkedSchoolTypes')">
									{{ item.value }}
								</el-checkbox>
              </el-checkbox-group>
            </div>
            <div class="chooseBlock-cell">
              <span class="chooseBlock-cell__label">博硕资格</span>
              <el-checkbox-group class="ui-tbHeaderForm-elCheckbox" v-model="queryParams.checkedQualifications">
                <el-checkbox v-for="item in Qualifications" :label="item.value" :key="item.value"
                  @change="onClickChooseBlockItem(item.value, 'checkedQualifications')">
									{{ item.label }}
								</el-checkbox>
              </el-checkbox-group>
            </div>
            <div class="chooseBlock-cell">
              <span class="chooseBlock-cell__label">院校层级</span>
              <el-checkbox-group class="ui-tbHeaderForm-elCheckbox" v-model="queryParams.checkedHierarchys">
                <el-checkbox v-for="item in Hierarchys" :label="item.value" :key="item.value"
                  @change="onClickChooseBlockItem(item.value, 'checkedHierarchys')">
									{{ item.label }}
								</el-checkbox>
              </el-checkbox-group>
            </div>
            <el-row type="flex">
              <div class="chooseBlock-cell" style="flex: 1; margin-bottom: 0;">
                <span class="chooseBlock-cell__label">办学性质</span>
                <el-checkbox-group class="ui-tbHeaderForm-elCheckbox" v-model="queryParams.checkedNatures">
                  <el-checkbox v-for="item in Natures" :label="item.value" :key="item.value"
                    @change="onClickChooseBlockItem(item.value, 'checkedNatures')">
										{{ item.label }}
									</el-checkbox>
                </el-checkbox-group>
              </div>
            </el-row>
          </div>
          <div class="collapse-tags" v-show="collapseOpen === false"
            :style="collapseOpen === false && 'min-height: 40px;'">
            <template
              v-for="(item) in ['checkedCities', 'checkedSchoolTypes', 'checkedQualifications', 'checkedHierarchys', 'checkedNatures']">
              <el-tag v-if="checkboxTagFilter(item)" @close="resetCheckBoxItem(item)" closable>
                {{ checkboxTagFilter(item) }}
              </el-tag>
            </template>
          </div>
          <el-row class="collapse-ft" type="flex" justify="end">
            <div style="flex-shrink: 0; display: flex; align-items: center; pointer-events: auto;">

							<el-dropdown @command="sortTable">
								<el-button style="margin-right: 10px;"  type="primary" size="medium">
									{{ queryParams.sortType | sortType2CN }}<i class="el-icon-arrow-down el-icon--right"></i>
								</el-button>
								<el-dropdown-menu slot="dropdown">
									<el-dropdown-item v-for="item in sortTypes" :key="item.value" :command="item.value">{{ item.label }}</el-dropdown-item>
								</el-dropdown-menu>
							</el-dropdown>
							<el-button type="primary" size="medium" @click="getTableData()">查询</el-button>
              <el-button size="medium" @click="handleReset()">重置</el-button>
              <span v-if="searchResult.list.length > 0" style="margin-left: 30px;margin-right: 15px;color: var(--primaryColor);">
                <span style="font-size: 14px; font-weight: 500;">
                  检索结果  {{ getSearchIndexByCurrentCode(searchResult.currentCode) }} / {{ searchResult.list.length }}
                </span>
                <span style="font-size: 16px; cursor: pointer;">
                  <span @click="toNextResultFn(-1)"><i class="el-icon-arrow-up searchResult-icon"></i></span>
                  <span @click="toNextResultFn(1)" style="margin-left: 4px"><i class="el-icon-arrow-down searchResult-icon"></i></span>
                </span>
              </span>
              <span @click="collapseOpen = !collapseOpen"
                style="margin-left: 120px; color: var(--primaryColor); cursor: pointer;">
                <img style="width: 17px; height: 17px; vertical-align: text-top;"
                  :style="collapseOpen === false && 'transform: rotateX(180deg);'"
                  src="~@/assets/images/programme-collapse.png" class="icon-home">
                {{ collapseOpen ? '收起' : '展开' }}
              </span>
            </div>
          </el-row>
        </section>
      </div>
			<!-- 表格区 -->
			<div style="margin: auto;overflow:auto">
				<!-- 普通 -->
				<virtual-scroll v-if="ptfrom" key="virtualScroll1"
					ref="virtualScroll"
					:data="tableData"
					:item-size="48"
					key-prop="id"
					@change="virtualList => (virtualScroll.tableData = virtualList)">
					<el-table class="ui-table" height="750px" row-key="id"
						v-loading="tableDataLoading" ref="multipleTable" :data="virtualScroll.tableData" :cell-style="cellStyle"
						:header-cell-style="{'text-align':'center'}"
						:row-class-name="tableTrClassName">
						<el-table-column prop="code" label="招生代码" width="95" align="center">
							<template slot-scope="props">
								<span @click="toggleExpand(props.row, props.$index)" :class="setCurrentCodeFontColor(props.row.code + '-' + props.row.groupCode)" style="cursor: pointer;">
									{{ props.row.code }}
									<i v-show="props.isExpanded" style="color: #ccc;" class="el-icon-caret-bottom"></i>
									<i v-show="!props.isExpanded" style="color: #ccc;" class="el-icon-caret-right"></i>
								</span>
							</template>
						</el-table-column>
						<el-table-column prop="schoolName" label="招生院校" align="left">
							<template slot-scope="scope">
								<span @click="details(scope.row)" style="cursor: pointer;font-size: 14px; display: inline-block;"
									v-html="showDate(scope.row.schoolName, '普通')"></span>
								<div style="cursor: pointer;font-size: 15px;display: inline-block;width: 8%;float: right;margin-right: 0.5em;">
									<i v-if="scope.row.schoolDesc" class="el-icon-warning-outline" style="font-size: 18px;color: #f96630;" @click="introduce(scope.row.schoolDesc)"></i>
								</div>
							</template>
						</el-table-column>
						<el-table-column align="center" prop="groupCode" label="专业组代码" width="80"></el-table-column>
						<el-table-column align="center" prop="subject" label="再选要求" width="72"></el-table-column>
						<el-table-column align="center" prop="recruitType" label="招生类别" width="72"></el-table-column>

						<el-table-column prop="shift_line2019" label="投档线" align="center" class-name="mergeTh">
							<el-table-column align="center" class-name="mergeTh-child" prop="shiftLine2019" :label="nowYear - 2 + ''" min-width="20px"></el-table-column>
							<el-table-column align="center" class-name="mergeTh-child" prop="shiftLine2020" :label="nowYear - 1 + ''" min-width="20px"></el-table-column>
							<el-table-column align="center" class-name="mergeTh-child" prop="shiftLine2021" :label="nowYear + ''" min-width="20px">
								<template slot-scope="scope">
									<span class="font-strong">{{ scope.row.shiftLine2021 }}</span>
								</template>
							</el-table-column>
						</el-table-column>
						<el-table-column prop="ranking2019" label="投档位次" align="center" class-name="mergeTh">
							<el-table-column align="center" class-name="mergeTh-child" prop="ranking2019" :label="nowYear - 2 + ''" min-width="24"></el-table-column>
							<el-table-column align="center" class-name="mergeTh-child" prop="ranking2020" :label="nowYear - 1 + ''" min-width="24"></el-table-column>
							<el-table-column align="center" class-name="mergeTh-child" prop="ranking2021" :label="nowYear + ''" min-width="24">
								<template slot-scope="scope">
									<span class="font-strong">{{ scope.row.ranking2021 }}</span>
								</template>
							</el-table-column>
						</el-table-column>
						<el-table-column align="center" prop="sortNum" label="院校排名" min-width="26px">
						</el-table-column>
						<el-table-column align="center" prop="schoolType" label="院校类型" min-width="26px">
						</el-table-column>

						<el-table-column align="center" prop="level" label="层级属性" min-width="26px">
						</el-table-column>
						<el-table-column align="center" prop="city" label="所在城市" min-width="26px">
						</el-table-column>
						<el-table-column align="center" prop="manager" label="主管部门" min-width="34px">
						</el-table-column>
						<el-table-column align="center" prop="majorPlan" label="录取形式" min-width="29px">
						</el-table-column>
						<!-- <el-table-column align="center" prop="" label="招生类型" min-width="29px">
						</el-table-column> -->
						<el-table-column align="center" prop="plan2022" :label="PlanYear + '计划'" min-width="20px">
							<template slot-scope="scope">
								<span v-if="scope.row.plan2022 > scope.row.plan2021" class="icon-top">
									{{ scope.row.plan2022 }}<i>↑</i>
								</span>
								<span v-else-if="scope.row.plan2021 > scope.row.plan2022" class="icon-bottom">
									{{ scope.row.plan2022 }}<i>↓</i>
								</span>
								<span v-else>{{ scope.row.plan2022 }}</span>
							</template>
						</el-table-column>
						<el-table-column align="center" prop="zy" label="填报" width="90">
							<template slot="header" slot-scope="scope">
								填报
							</template>
							<template slot-scope="scope">
								<el-checkbox @change="(value) => schemeChange(value, scope)" v-model="scope.row._schemeChecked">
                  {{ scope.row._schemeChecked ? `已选${scope.row.schemeNum}` : '选择' }}
                </el-checkbox>
							</template>
						</el-table-column>
						<!-- 展开后的表格 -->
						<virtual-column type="expand" width="1">
							<template slot-scope="props">
								<el-table class="ui-expandTable" :data="props.row.children1"
									:cell-style="cellStyles" :header-cell-style="{'text-align':'center'}">
									<el-table-column align="center" prop="majorCode" label="专业代码" width="95"></el-table-column>
									<el-table-column prop="majorName" label="专业名称" width="216">
										<template slot-scope="scope">
											<el-row type="flex" style="text-align: left; margin-right: 2em;">
												<span style="font-size: 14px; margin-right: 0.5em; flex: 1;" v-html="showDate(scope.row.majorName, '普通')"></span>
												<!-- row.color === 'red' -->
												<i v-if="scope.row.majorDesc" class="el-icon-warning-outline" style="font-size: 18px;color: #f96630;" @click="introduce(scope.row.majorDesc)"></i>
											</el-row>
										</template>
									</el-table-column>
									<el-table-column align="center" prop="level" label="包含专业及等级排名">
										<template slot-scope="scope">
											<div style="text-align: left;">{{ scope.row.level }}</div>
										</template>
									</el-table-column>
									<el-table-column prop="msg2015" label="计划数 / 录取数  |  最高分 / 平均分 / 最低分| 最高位次-最低位次" class-name="mergeTh" align="center">
										<el-table-column prop="msg2015" :label="MajorNowYear - 2 + ''" class-name="mergeTh-child" width="188" align="center"></el-table-column>
										<el-table-column prop="msg2016" :label="MajorNowYear - 1 + ''" class-name="mergeTh-child" width="188" align="center"></el-table-column>
										<el-table-column prop="msg2017" :label="MajorNowYear + ''" class-name="mergeTh-child" width="188" align="center"></el-table-column>
									</el-table-column>
									<el-table-column prop="plan2018" :label="MajorPlanYear + '计划'" width="50" align="center">
										<template slot-scope="scope">
											<span v-if="scope.row.plan2018 > scope.row.plan2017" class="icon-top">{{ scope.row.plan2018 }}↑</span>
											<span v-else-if="scope.row.plan2017 > scope.row.plan2018" class="icon-bottom">{{ scope.row.plan2018 }}↓</span>
											<span v-else>{{ scope.row.plan2018 }}</span>
										</template>
									</el-table-column>
									<el-table-column label="操作" style="padding: 0;" align="center" width="90">
										<template slot-scope="propss" style="padding: 0;">
											<!-- <el-checkbox @change="(value) => onChangeMajor(value, { parentRow: props, childRow: propss })" v-model="propss.row._isChecked">{{ propss.row._isChecked ? '已选' : '选择' }}</el-checkbox> -->
											<el-dropdown trigger="click" style="margin: 0;padding: 0;">
												<span class="el-dropdown-link" :class="propss.row.sort ? 'scheme' : 'not-scheme'"
													style="font-size: 14px;margin: 0;cursor: pointer;">
													{{ propss.row.sort ? propss.row.sort : '选择' }}
												</span>
												<i class="el-icon-caret-bottom"></i>
												<el-dropdown-menu slot="dropdown">
													<el-dropdown-item v-for="(item, index) in majorList" :key="index" :command="item.label"
														style="padding: 0;text-align: center;">
														<span :style="majorDisabled.includes(item.label) ? 'color: #c0c4cc;': ''"
															@click="!majorDisabled.includes(item.label)
																				? majorchange(props.row, propss.row, item.label)
																				: () => {}"
															style="width: 60px;padding: 10px;">{{ item.label }}</span>
													</el-dropdown-item>
												</el-dropdown-menu>
											</el-dropdown>
										</template>
									</el-table-column>
								</el-table>
							</template>
						</virtual-column>
					</el-table>
				</virtual-scroll>
				<!-- 提前批次 -->
				<virtual-scroll v-if="tqfrom" key="virtualScroll2"
					ref="virtualScroll"
					:data="tableData"
					:item-size="48"
					key-prop="id"
					@change="virtualList => (virtualScroll.tableData = virtualList)">
					<el-table class="ui-table" height="750px" row-key="id"
						v-loading="tableDataLoading"
						ref="multipleTable2"
						:data="virtualScroll.tableData"
						:cell-style="cellStyle"
						:header-cell-style="{'text-align':'center'}"
						:row-class-name="tableTrClassName">
						<el-table-column prop="code" label="院校代码" width="80px" align="center">
							<template slot-scope="props">
								<span @click="toggleExpand(props.row, props.$index)" :class="setCurrentCodeFontColor(props.row.code + '-' + props.row.groupCode)" style="cursor: pointer;">
									{{ props.row.code }}
									<i v-show="props.isExpanded" style="color: #ccc;" class="el-icon-caret-bottom"></i>
									<i v-show="!props.isExpanded" style="color: #ccc;" class="el-icon-caret-right"></i>
								</span>
							</template>
						</el-table-column>
						<el-table-column prop="schoolName" label="招生院校" width="132px" align="left">
							<template slot-scope="scope">
								<span @click="details(scope.row)"
									style="cursor: pointer;font-size: 14px;margin-left: 0.5em;display: inline-block;"
									v-html="showDate(scope.row.schoolName, '提前')"></span>
								<div style="cursor: pointer;font-size: 15px;display: inline-block;width: 8%;float: right;margin-right: 0.5em;">
									<i v-if="scope.row.schoolDesc" class="el-icon-warning-outline" style="font-size: 18px;color: #f96630;" @click="introduce(scope.row.schoolDesc)"></i>
								</div>
							</template>
						</el-table-column>

						<el-table-column align="center" prop="groupCode" label="专业组" width="60"></el-table-column>
						<el-table-column align="center" prop="subject" label="再选要求" width="70"></el-table-column>
						<el-table-column align="center" prop="recruitType" label="招生类别" width="66"></el-table-column>

						<el-table-column prop="toudang2015" label="计划数|投档数" class-name="mergeTh" align="center">
							<el-table-column prop="toudang2019" :label="nowYear - 2 + ''" class-name="mergeTh-child" align="center" min-width="72px"></el-table-column>
							<el-table-column prop="toudang2020" :label="nowYear - 1 + ''" class-name="mergeTh-child" align="center" min-width="72px"></el-table-column>
							<el-table-column prop="toudang2021" :label="nowYear + ''" class-name="mergeTh-child" align="center" min-width="96px">
								<template slot-scope="scope">
									<span class="font-strong">{{ scope.row.toudang2021 }}</span>
								</template>
							</el-table-column>
						</el-table-column>

						<el-table-column prop="fluctuation2019" label="最高分/平均分/最低分" class-name="mergeTh" align="center">
							<el-table-column prop="shiftLine2019" :label="nowYear - 2 + ''" class-name="mergeTh-child" align="center" min-width="92px"></el-table-column>
							<el-table-column prop="shiftLine2020" :label="nowYear - 1 + ''" class-name="mergeTh-child" align="center" min-width="92px"></el-table-column>
							<el-table-column prop="shiftLine2021" :label="nowYear + ''" class-name="mergeTh-child" align="center" min-width="96px">
								<template slot-scope="scope">
									<span class="font-strong">{{ scope.row.shiftLine2021 }}</span>
								</template>
							</el-table-column>
						</el-table-column>
						<el-table-column prop="ranking2019" label="参考位次" class-name="mergeTh" align="center">
							<el-table-column prop="ranking2019" :label="nowYear - 2 + ''" class-name="mergeTh-child" align="center" min-width="50px"></el-table-column>
							<el-table-column prop="ranking2020" :label="nowYear - 1 + ''" class-name="mergeTh-child" align="center" min-width="50px"></el-table-column>
							<el-table-column prop="ranking2021" :label="nowYear + ''" class-name="mergeTh-child" align="center" min-width="52px">
								<template slot-scope="scope">
									<span class="font-strong">{{ scope.row.ranking2021 }}</span>
								</template>
							</el-table-column>
						</el-table-column>
						<!-- <el-table-column prop="xiancha" label="招生类别" min-width="30px">
						</el-table-column> -->
						<el-table-column prop="level" label="层级属性" min-width="70px" align="center">
						</el-table-column>
						<el-table-column prop="city" label="所在城市" min-width="70px" align="center">
						</el-table-column>
						<el-table-column prop="manager" label="主管部门" min-width="64px" align="center">
						</el-table-column>
						<el-table-column prop="plan2022" :label="PlanYear + '计划'" min-width="48px" align="center">
							<template slot-scope="scope">
								<span v-if="scope.row.plan2022 > scope.row.plan2021" class="icon-top">
									{{ scope.row.plan2022 }}<i>↑</i>
								</span>
								<span v-else-if="scope.row.plan2021 > scope.row.plan2022" class="icon-bottom">
									{{ scope.row.plan2022 }}<i>↓</i>
								</span>
								<span v-else>{{ scope.row.plan2022 }}</span>
							</template>
						</el-table-column>
						<el-table-column prop="zy" label="填报" width="90" align="center">
							<template slot="header" slot-scope="scope">
								填报{{ schoolCheckedNumber }}
							</template>
							<template slot-scope="scope">
								<el-checkbox
									@change="(value) => schemeChange(value, scope)"
									v-model="scope.row._schemeChecked">
									{{ scope.row._schemeChecked ? `已选${scope.row.schemeNum}` : '选择' }}
								</el-checkbox>
							</template>
						</el-table-column>
						<!-- 展开后的表格 -->
						<virtual-column type="expand" width="1">
							<template slot-scope="props">
								<el-table class="ui-expandTable" :data="props.row.children1"
									:cell-style="cellStyles" :header-cell-style="{'text-align':'center'}">
									<el-table-column prop="majorCode" label="专业代码" width="95" align="center"></el-table-column>
									<el-table-column prop="majorName" label="专业名称" width="216">
										<template slot-scope="scope">
											<el-row type="flex" style="text-align: left; margin-right: 2em;">
												<span style="font-size: 14px; margin-right: 0.5em; flex: 1;" v-html="showDate(scope.row.majorName, '普通')"></span>
												<!-- row.color === 'red' -->
												<i v-if="scope.row.majorDesc" class="el-icon-warning-outline" style="font-size: 18px;color: #f96630;" @click="introduce(scope.row.majorDesc)"></i>
											</el-row>
										</template>
									</el-table-column>
									<el-table-column align="center" prop="level" label="包含专业及等级排名" width="260">
										<template slot-scope="scope">
											<div style="text-align: left;">{{ scope.row.level }}</div>
										</template>
									</el-table-column>
									<el-table-column prop="msg2015" label="计划数 / 录取数 | 最高分 / 平均分 / 最低分 | 最高位次-最低位次" class-name="mergeTh" align="center">
										<el-table-column prop="msg2015" :label="MajorNowYear - 2 + ''" class-name="mergeTh-child" align="center" min-width="35px"></el-table-column>
										<el-table-column prop="msg2016" :label="MajorNowYear - 1 + ''" class-name="mergeTh-child" align="center" min-width="35px"></el-table-column>
										<el-table-column prop="msg2017" :label="MajorNowYear + ''" class-name="mergeTh-child" align="center" min-width="35px"></el-table-column>
									</el-table-column>
									<el-table-column prop="plan2018" :label="MajorPlanYear + '计划'" min-width="8px" align="center">
										<template slot-scope="scope">
											<span v-if="scope.row.plan2018 > scope.row.plan2017" class="icon-top">{{ scope.row.plan2018 }}↑</span>
											<span v-else-if="scope.row.plan2017 > scope.row.plan2018" class="icon-bottom">{{ scope.row.plan2018 }}↓</span>
											<span v-else>{{ scope.row.plan2018 }}</span>
										</template>
									</el-table-column>
									<el-table-column label="操作" min-width="9px" style="padding: 0;" align="center" width="90">
										<template slot-scope="propss" style="padding: 0;">
											<!-- <el-checkbox @change="(value) => onChangeMajor(value, { parentRow: props, childRow: propss })" v-model="propss.row._isChecked">{{ propss.row._isChecked ? '已选' : '选择' }}</el-checkbox> -->
											<el-dropdown trigger="click" style="margin: 0;padding: 0;">
												<span class="el-dropdown-link" :class="propss.row.sort ? 'scheme' : 'not-scheme'"
													style="font-size: 14px;margin: 0;cursor: pointer;">
													{{ propss.row.sort ? propss.row.sort : '选择' }}
												</span>
												<i class="el-icon-caret-bottom"></i>
												<el-dropdown-menu slot="dropdown">
													<el-dropdown-item v-for="(item, index) in majorList" :key="index" :command="item.label"
														style="padding: 0;text-align: center;">
														<span :style="majorDisabled.includes(item.label) ? 'color: #c0c4cc;': ''"
															@click="!majorDisabled.includes(item.label)
																				? majorchange(props.row, propss.row, item.label)
																				: () => {}"
															style="width: 60px;padding: 10px;">{{ item.label }}</span>
													</el-dropdown-item>
												</el-dropdown-menu>
											</el-dropdown>

										</template>
									</el-table-column>
								</el-table>
							</template>
						</virtual-column>
					</el-table>
				</virtual-scroll>
			</div>
			<ChartDialog :dialog-visible.sync="precedenceDialog.open" title="位次查询"></ChartDialog>
			<!-- 学校简介 -->
			<el-dialog :visible.sync="schoolIntroduce.open" width="1000px" :close-on-click-modal="false"
				style="margin-top: 150px;">
				<div style="font-size: 16px;width: 100%;margin: auto;color: #000000;">
					{{ schoolIntroduce.data }}
				</div>
			</el-dialog>
			<!-- 右侧悬浮 -->
			<div id="npt">
				<el-button style="background-color: #f96630;">{{ schoolCheckedNumber }}</el-button></br>
				<el-button style="background-color: green;margin-top: 20px;" @click="empty()">清空</el-button></br>
				<el-button style="background-color: red;margin-top: 20px;" @click="saveScheme()">保存</el-button></br>
				<el-button style="background-color: orange;margin-top: 20px;" @click="handleClick()">预览</el-button></br>
				<!-- <el-button style="background-color: blue;margin-top: 20px;" @click="newSchemeDialog = true">新建</el-button></br> -->
				<el-button style="background-color: #a4b0be;margin-top: 20px;" @click="UpperLevel()">上一级</el-button>
			</div>
    </div>
  </div>
</template>
<script>
import { request } from "@/util/request.js"
import ChartDialog from "./components/ChartDialog"
import VirtualScroll, { VirtualColumn } from 'el-table-virtual-scroll'

const natureOptions = [
	{ label: '不限', value: '不限' }, { label: '公办', value: '1' }, { label: '民办', value: '2' }, { label: '合办', value: '3' }
]
const HierarchyOptions = [
	{ label: '不限', value: '不限' }, { label: '双一流', value: '1' }, { label: '中央直管', value: '2' }, { label: '985', value: '3' }, { label: '211', value: '4' }, { label: '双高计划', value: '5' }, { label: '国家示范(骨干)', value: '6' }
]
const QualificationsOptions = [
	{ label: '不限', value: '不限' }, { label: '硕士点', value: '1' }, { label: '博士点', value: '2' }, { label: '研究生院', value: '3' }, { label: '自划线', value: '4' }, { label: '推免资格', value: '5' }
]
const defaultRecruitType = ['普通志愿','中外合办']

export default {
	components: {
		ChartDialog,
		VirtualScroll,
		VirtualColumn
	},
  data() {
    return {
      searchResult: {
        currentCode: '',
        list: [],
      },

			virtualScroll: {
				tableData: [],
			},
			recruitType: {
				default: ['普通志愿', '中外合办'],
			},
			schoolCheckedNumber: '',
			schoolIntroduce: {
				data: null,
				open: false,
			},
			// 位次图表
			precedenceDialog: {
				open: false,
			},
			nowYear: null, 			// 当前数据年份
			PlanYear: null,				// xx年计划
      collapseOpen: false, // 展开收起标记
      studentInfo: [],
			secondarilySubjects: [
				{ label: '化学', value: '化学' },
				{ label: '生物', value: '生物' },
				{ label: '政治', value: '政治' },
				{ label: '地理', value: '地理' },
			],
      user: null,
			sortTypes: [
				{ value: 1, label: '按院校排序' },
				{ value: 2, label: '按专业组排序' },
			],
      tabs: {
				list: [
					{ label: '本科提前批单设', value: '本科提前批单设' },
					{ label: '本科提前批平行', value: '本科提前批平行' },
					{ label: '高职专科批提前', value: '高职专科批提前' },
					{ label: '本科普通批单设', value: '本科普通批单设' },
					{ label: '本科普通批平行', value: '本科普通批平行' },
					{ label: '高职专科普通批', value: '高职专科普通批' },
				],
				active: '本科普通批平行',
			},
			recruitTypeList: [
				// { label: '不限', value: '不限' },
				{ label: '普通志愿', value: '普通志愿' },
				{ label: '中外合办', value: '中外合办' },
				{ label: '国家专项', value: '国家专项' },
				{ label: '地方专项', value: '地方专项' },
				{ label: '定向就业', value: '定向就业' },
				{ label: '预科班', value: '预科班' },
			],
      cities: this.$constants.provinces,
			SchoolTypes: this.$constants.schoolTypes,
			Natures: natureOptions,
			Hierarchys: HierarchyOptions,
			Qualifications: QualificationsOptions,
      queryParams: {
				school: '', 	// 院校名称
				checkGroupCode: '', 	// 专业组code
				schoice: 'W', // 首选科目
				subject: ['化学','生物'], // 再选科目
        checkedCities: ['不限'],
        checkedSchoolTypes: ['不限'],
        checkedNatures: ['不限'],
        checkedHierarchys: ['不限'],
        checkedQualifications: ['不限'],
				recruitType: ['不限'],  // 类别
				major1: '', 			// 专业1
				major2: '', 			// 专业2
				major3: '', 			// 专业3
        fraction: null,   // 分数
        precedence: null, // 位次
				sortType: 2,
      },
			tableData: [],
			tableDataCount: 0,
			tableDataLoading: false,
      count: 0,
      // 专业列表
      majorList: [
				{ value: '1',label: '专业1' },
				{ value: '2',label: '专业2' },
				{ value: '3',label: '专业3' },
				{ value: '4',label: '专业4' },
				{ value: '5',label: '专业5' },
				{ value: '6',label: '专业6' },
				// { value: '7',label: '备选' },
				{ value: '8',label: '取消' },
			],
			majorDisabled: [], // 不可选专业列表
      disabledFlag: false,
			checkGroupCodeList: [],
		}
  },
	filters: {
		sortType2CN(type) {
			return {
				1: '按院校排序',
				2: '按专业组排序',
			}[type] || '请选择'
		}
	},

  created() {

		let examineeId = this.$route.query.examineeId


		this.$api.getMyExamineeProgramme({ stuId: examineeId }).then(res => {
			console.log('getMyExamineeById', res);
			this.examineeProgramme = res.data
		})
    const user = localStorage.getItem("stu");
		this.user = JSON.parse(user)
		console.log('user', this.user);
    // this.stopF5Refresh();
		if (JSON.parse(this.$route.query.student != null)) {
			// this.dialogVisible = false
			this.studentInfo = JSON.parse(this.$route.query.student);
      // 用于记录 programmeId
			this.programmes = JSON.parse(this.$route.query.student);
			this.childrenData = [...this.studentInfo]
      // 过滤新增时的无用数据
      this.childrenData = this.childrenData.filter(item => ![null, undefined,''].includes(item.schoolCode))
			this.studentInfo[0].majorType = JSON.stringify(this.studentInfo[0].majorType)
			if (this.studentInfo[0].schemeRecruitType) {
				this.queryParams.recruitType = this.studentInfo[0].schemeRecruitType.split(',')
				this.recruitType.default = this.studentInfo[0].schemeRecruitType.split(',')
			}

			let tabItem = this.tabs.list.find(item => item.label === this.studentInfo[0].batch)
			if (tabItem) {
				this.tabs.active = tabItem.value
			}
			if (this.studentInfo[0].batch.indexOf('提前') !== -1) {
				this.tqfrom = true
				this.ptfrom = false
			} else {
				this.tqfrom = false
				this.ptfrom = true
			}
		} else {
			// this.$router.push({
			// 	path: "/ManagementCenter"
			// })
		}
    if (this.studentInfo[0].batch.indexOf('提前') !== -1) {
      this.disabledFlag = true;
    }
		if(this.studentInfo[0].majorType == 2){
			this.queryParams.schoice = 'L';
		}
		if (this.user.subject1 != undefined && this.user.subject1 !=''
				&& this.user.subject2 != undefined && this.user.subject2 !='') {
			this.queryParams.subject = [this.user.subject1, this.user.subject2]
		}
    this.getTableData().then(res => {
			let findIndex = this.tableData.findIndex((item) => item._schemeChecked)
			findIndex !== -1 && this.$refs.virtualScroll.scrollTo(findIndex)
		})
    this.getDataYearOfDict()
  },

  mounted() { },
  methods: {
		Ipt(type) {
			if (type == 1) {
				this.queryParams.precedence = null
			} else if (type == 2) {
				this.queryParams.fraction = null
			}
		},
		onClickShowPrecedenceDialog() {
			this.precedenceDialog.open = true
		},
    checkboxTagFilter(value) {
			if (this.queryParams[value]) {
				return this.queryParams[value].filter(item => item !== '不限')
								.map(item => {
									if (['checkedNatures', 'checkedHierarchys', 'checkedQualifications'].includes(value)) {
										let arrayKey = value.replace('checked', '')
										let findVal = this[arrayKey].find(i => i.value === item)
										return findVal.label || item
									}
									return item
								})
								.join(',')
			}
			return ''
		},

    queryMajorSearch(queryString, cb) {
			request({
				method: 'get',
				url: 'schoolV2/getMajorName?majorName='+queryString,
			}).then(res => {
				var restaurants = res.data;
				var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
				// 调用 callback 返回建议列表的数据
				cb(results);
			})
		},
		createFilter(queryString) {
			return (restaurant) => {
				return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) !== -1);
			};
		},
		querySchoolSearch(queryString, cb) {
			this.checkGroupCodeList = []
			request({
				method: 'post',
				url: 'schoolV2/getSchoolName',
				params: {
					majorType: this.queryParams.majorType,
					batch: this.tabs.active,
					schoolName: queryString,
				}
			}).then(res => {
				var restaurants = res.data;
				var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
				// 调用 callback 返回建议列表的数据
				cb(results);
			})
		},
		querySchoolGroupCode () {
			request({
				method: 'post',
				url: 'schoolV2/getGroupCode',
				data: {
					majorType: [1, 3].includes(this.programmes[0].majorType) ? 1 : 2,
					recruitType: this.queryParams.recruitType,
					batch: this.tabs.active,
					subject: this.queryParams.subject,
					school: this.queryParams.school,
				}
			}).then(res => {
				this.checkGroupCodeList = res.data;
			})
		},
		createFilter1(queryString) {
			return (restaurant) => {
				return (restaurant.value.toLowerCase().indexOf(queryString.toLowerCase()) !== -1);
			};
		},

		onClickChooseBlockItem(value, propName){
			this.school = null
			this.major = null
			if (['不限', '其他'].includes(value)) {
				return this.queryParams[propName] = [value]
			}
			this.queryParams[propName].forEach(item => {
				if(['不限', '其他'].includes(item)){
					this.queryParams[propName].splice(this.queryParams[propName].indexOf(item), 1)
				}
			})
			if (this.queryParams[propName].length === 0) {
				this.queryParams[propName] = ['不限']
			}
		},

		resetCheckBoxItem(dataProp) {
			this.queryParams[dataProp] = ['不限']
		},

		handleReset() {
      this.queryParams = {
				...this.queryParams,
				school: '', 	// 院校名称
				checkGroupCode: '', 	// 专业组code
				// schoice: 'W', // 首选科目
				// subject: ['化学','生物'], // 再选科目
				// recruitType: ['不限'],  // 类别
        checkedCities: ['不限'],
        checkedSchoolTypes: ['不限'],
        checkedNatures: ['不限'],
        checkedHierarchys: ['不限'],
        checkedQualifications: ['不限'],
				major1: '', 			// 专业1
				major2: '', 			// 专业2
				major3: '', 			// 专业3
        fraction: null,   // 分数
        precedence: null, // 位次
				sortType: 2, // 按学校名称排序 向上就传1 向下传2
      }
			// this.tabs.active = '本科普通批平行'
			//重置之后自动搜索返回顶部
			this.getTableData();
			this.goTableTop();
		},

		getDataYearOfDict() {
			this.$api.getDict({ dictType: this.tabs.active }).then(res => {
				if (![0, 200].includes(res.code)) {
					return this.$message.error(res.msg)
				}
				console.log('getDataYearOfDict', res.data);
				res.data.forEach(item => {
					if(item.dictName === 'now'){
						this.nowYear = item.dictValue
					}else if (item.dictName == "plan") {
						this.PlanYear = item.dictValue
					}
					else if (item.dictName == "majornow") {
						this.MajorNowYear = item.dictValue
					} else if (item.dictName == "majorplan") {
						this.MajorPlanYear = item.dictValue
					}
				})
			})
		},

    resetSearchResult() {
      this.searchResult = {
        currentCode: '',
        list: [],
      }
    },
    // 获取当前currentCode下标
    getSearchIndexByCurrentCode () {
      if (!this.searchResult.currentCode) return
      let index = this.searchResult.list.findIndex(item => item === this.searchResult.currentCode);
      return index + 1
    },

    // 检索结果上一个下一个
    toNextResultFn(number) {
      const searchIndex = this.searchResult.list.findIndex(item => item === this.searchResult.currentCode);
      let toIndex = searchIndex + number
      if (searchIndex + number < 0) {
        toIndex = this.searchResult.list.length - 1
      }
      else if (searchIndex + number >= this.searchResult.list.length) {
        toIndex = 0
      }
      let realCode = this.searchResult.list[toIndex]
      this.searchResult.currentCode = realCode
      let realIndex = this.tableData.findIndex(item => `${item.code}-${item.groupCode}` === realCode)
      this.$refs.virtualScroll.scrollTo(realIndex)
    },

    setCurrentCodeFontColor(code) {
      let classes = '';
      if (this.searchResult.currentCode === code) {
        classes = 'searchResult-currentCode'
      }
      return classes;
    },

		getTableData() {
			if(this.queryParams.subject.length < 2){
				this.$message.error('再选科目不得少于两个！');
				return Promise.reject(res)
			}
      this.resetSearchResult()
			this.tableDataLoading = true
			// ['checkedCities', 'checkedSchoolTypes', 'checkedQualifications', 'checkedHierarchys', 'checkedNatures']
			return request({
				method: 'post',
				url: '/schoolV2/getSchoolInformations',
				data: {
					...this.queryParams,
					batch: this.tabs.active,
					checkedCities: undefined,
					checkedSchoolTypes: undefined,
					checkedQualifications: undefined,
					checkedHierarchys: undefined,
					checkedNatures: undefined,
					majorType: [1, 3].includes(this.programmes[0].majorType) ? 1 : 2,
					hierarchys: this.queryParams.checkedHierarchys.filter(item => item !== '不限').join('|'),
					qualifications: this.queryParams.checkedQualifications.filter(item => item !== '不限').join('|'),
					type: this.queryParams.checkedSchoolTypes.filter(item => item !== '不限'),
					nature: this.queryParams.checkedNatures.filter(item => item !== '不限'),
					city: this.queryParams.checkedCities.filter(item => item !== '不限'),
					recruitType: this.tabs.active.indexOf('本科普通批平行') !== -1
												? this.queryParams.recruitType.filter(item => item !== '不限')
												: [],
				}
			}).then(res => {
				if (![0, 200].includes(res.code)) {
					this.$message.error(res.msg)
					return Promise.reject(res)
				}
				if (this.tableData) {
					res.data.forEach(item => {
						item.schemeName = ''
            item.schemeNum = ''
						item._schemeChecked = false
						this.childrenData.forEach(subItem => {
							if (item.code == subItem.schoolCode && item.groupCode == subItem.groupCode) {
								item.schemeName = subItem.schemeName
                item.schemeNum = subItem.schemeNum
								item._schemeChecked = true
							}
						})
					})
					this.schoolCheckedNumber = this.getSchoolCheckedNumber()
				}
				this.tableData = res.data
				this.tableDataCount = res.searchTotal
				this.tableDataLoading = false
        let result = this.tableData.filter(item => item.color === 1)
        this.searchResult.list = result.map(item => `${item.code}-${item.groupCode}`)
				this.dingweiSchool()
				return res
			})
		},

		// 分数和位次在表格中的定位
		dingweiSchool(){
      const scrollToRowByIndex = (index) => {
        if (index === -1) {
          return this.$message.error('无匹配结果')
        }
        this.$refs.virtualScroll.scrollTo(index)
        if (this.searchResult.list.length > 0) {
          this.searchResult.currentCode = `${this.tableData[index].code}-${this.tableData[index].groupCode}`
        }
      }
			if(this.queryParams.school != null && this.queryParams.school != ""){
				let batch='普通';
				if(this.tabs.active.indexOf('提前') !== -1){
					batch="提前";
				}
				let checkGroupCode = this.queryParams.checkGroupCode;
				let index = this.tableData.findIndex(i => {
					if(checkGroupCode != ''){
						if(i.schoolName == this.queryParams.school && i.groupCode == checkGroupCode){
							return true
						}
					}else if(i.schoolName == this.queryParams.school){
						return true
					}
				});
				scrollToRowByIndex(index)
			}else if(this.queryParams.fraction != null && this.queryParams.fraction != ""){
				let batch='普通';
				if(this.tabs.active.indexOf('提前') !== -1){
					batch="提前";
				}
				this.queryParams.precedence=null;
				let isOne = 0;
				let findIndex = null
				let fraction = this.queryParams.fraction;
				while(isOne==0){
					findIndex = this.tableData.findIndex(i=>{
            if(this.queryParams.sortType == 1){
              if(i.proposedScore==fraction){
                i.newColor = 2
                isOne=1;
                return true
              }
            }else{
              if(i.groupProposedScore==fraction){
                i.newColor = 2
                isOne=1;
                return true
              }
            }
					})
					if(fraction>150){
						fraction--;
					}else{
						isOne=1;
					}
				}
        scrollToRowByIndex(findIndex)
			}else if(this.queryParams.precedence!=null&&this.queryParams.precedence!=""){
				let batch = '普通';
				if(this.tabs.active.indexOf('提前') !== -1){
					batch = "提前";
				}
				this.queryParams.fraction = null;
				let precedence = this.queryParams.precedence
				let index = this.tableData.findIndex(i => {
          if(this.queryParams.sortType == 1){
            if(precedence <= i.proposedwc){
              i.newColor = 2
              return true
            }
          }else {
            if(precedence <= i.groupProposedwc){
              i.newColor = 2
              return true
            }
          }
				});
				scrollToRowByIndex(index)
			}else {
				let batch = '普通';
				if(this.tabs.active.indexOf('提前') !== -1){
					batch = "提前";
				}
				let index = this.tableData.findIndex(i => i.color == 1);
				index !== -1 && scrollToRowByIndex(index)
			}
		},
		getSchoolCheckedNumber() {
			return this.childrenData.filter(item => ![null, undefined,''].includes(item.schoolCode)).length
		},
		sortTable(command) {
			this.queryParams.sortType = command
			this.getTableData()
		},

		toggleExpand(row) {
      let tableDataIndex = this.tableData.findIndex(item => item.id == row.id)
			if (!row.$v_expanded) {
        // 先关闭所有
        this.tableData.filter(item => item.$v_expanded === true).forEach(item => {
          this.$refs.virtualScroll.toggleRowExpansion(item, false)
        })
				let majorType = this.programmes != null && this.programmes.length > 0 && this.programmes[0].majorType != null ? this.programmes[0].majorType : this.user.major
				request({
					method: 'post',
					url: 'schoolV2/getSchoolMajor',
					data: {
						schoolCode: row.code,
						majorType: [1, 3].includes(majorType) ? 1 : 2,
						major1: this.queryParams.major1,
						major2: this.queryParams.major2,
						major3: this.queryParams.major3,
						groupCode: row.groupCode,
					}
				}).then(res => {
					res.data.map(item => {
						item.sort = ''
						item._isChecked = false
					})
					this.$set(this.tableData[tableDataIndex], "children1", res.data)
					this.majorDisabled = []
					this.childrenData.filter(item =>
						this.tableData[tableDataIndex].code == item.schoolCode &&
						this.tableData[tableDataIndex].groupCode == item.groupCode
					).forEach(item => {
						if (!['', null, undefined].includes(item.majorList)) {
							res.data.forEach(o => {
								let majorIndex = item.majorList.findIndex(majorItem => majorItem.majorCode === o.majorCode)
								if (majorIndex !== -1) {
									o.sort = item.majorList[majorIndex].sort
									o._isChecked = true
								}
							})
							this.majorDisabled = res.data.filter(item => !['', null, undefined].includes(item.sort)).map(item => item.sort)
						}
					})
					this.$refs.virtualScroll.toggleRowExpansion(row)
          this.$refs.virtualScroll.scrollTo(tableDataIndex)
					this.$refs.virtualScroll.update()
				})
			} else {
				this.majorDisabled = []
        this.$refs.virtualScroll.scrollTo(tableDataIndex)
				this.$refs.virtualScroll.toggleRowExpansion(row)
				this.$refs.virtualScroll.update()
			}
    },
		// 执行点击行调用的方法，展开和折叠行
		clickTable(row, index) {
			console.log(index);
			let state = false
			// state = true 收起时清空children数据
			let result = this.tableData.find(item => item.id == row.id)
			if (result && result.children != null) {
				state = true
				result.children = null
			}
			row.isExpanded = state
			if (state == false) {
				this.getSchoolMajor(row, index)
			} else {
				this.$refs.multipleTable && this.$refs.multipleTable.toggleRowExpansion(row)
				this.$refs.multipleTable1 && this.$refs.multipleTable1.toggleRowExpansion(row)
				this.$refs.multipleTable2 && this.$refs.multipleTable2.toggleRowExpansion(row)
			}

		},

		getSchoolMajor(row) {
			let majorType = this.programmes != null && this.programmes.length > 0 && this.programmes[0].majorType != null ? this.programmes[0].majorType : this.user.major
			request({
				method: 'post',
				url: 'schoolV2/getSchoolMajor',
				data: {
					schoolCode: row.code,
					majorType: [1, 3].includes(majorType) ? 1 : 2,
					major1: this.queryParams.major1,
					major2: this.queryParams.major2,
					major3: this.queryParams.major3,
					groupCode: row.groupCode,
				}
			}).then(res => {
				let tableDataIndex = this.tableData.findIndex(item => item.id == row.id)
				res.data.map(item => {
					item.sort = ''
					item._isChecked = false
				})
				this.$set(this.tableData[tableDataIndex], "children", res.data)
				this.childrenData.forEach(item => {
					if (this.tableData[tableDataIndex].code == item.schoolCode && this.tableData[tableDataIndex].groupCode == item.groupCode) {
						if (!['', null, undefined].includes(item.majorList)) {
							for (var r = 0; r < item.majorList.length; r++) {
								res.data.forEach(o => {
									if (item.majorList[r].majorCode == o.majorCode) {
										o.sort = item.majorList[r].sort
										o._isChecked = true
									}
								})
							}
						}
					}
				})
				this.$forceUpdate()
				this.$refs.multipleTable && this.$refs.multipleTable.toggleRowExpansion(row)
				this.$refs.multipleTable1 && this.$refs.multipleTable1.toggleRowExpansion(row)
				this.$refs.multipleTable2 && this.$refs.multipleTable2.toggleRowExpansion(row)
			})
		},

		// 搜索后高亮显示某行
		cellStyle({ row, column, rowIndex, columnIndex }) {
			let styleClass = ''
			// color:1 td checkbox搜索结果匹配时
			// newColor === 2 td分数与位次的激活样式
			if (row.newColor === 2){
				styleClass += `backgroundColor: var(--orange01); color: blue`;
			}else if (row.color === 1){
				styleClass += `backgroundColor: var(--orange01);`;
			}
			//招生类别样式
			if (this.tabs.active == "本科普通批平行" && !defaultRecruitType.includes(row.recruitType) && column.property=="recruitType"){
				styleClass += `color: #39B830`;
			}
			//院校查询样式
			if (this.queryParams.school != null && this.queryParams.school != "" && this.queryParams.school == row.schoolName && column.property=="schoolName"){
				let checkGroupCode = this.queryParams.checkGroupCode;
				if(checkGroupCode != ''){
					if(checkGroupCode == row.groupCode){
						styleClass += `color: red; font-style: italic;`;
					}
				}else {
					styleClass += `color: red; font-style: italic;`;
				}
			}
			return styleClass
		},
		// 搜索后高亮显示某行--用于展开后的表格样式
		cellStyles({ row, column, rowIndex, columnIndex }) {
			let styleClass = ''
			if (row.color === 'red') {
				styleClass = `color: var(--primaryColor)`;
			}
			return styleClass
		},

		showDate(val, batch) {
			if (this.schoolBoolen != true) {
				return val
			}
			val = val + '';
			if (val.indexOf(this.queryParams.school) !== -1 && this.queryParams.school !== '') {
				if (batch == "提前") {
					return val.replace(this.queryParams.school, '<em class="Tqseat">' + this.queryParams.school + '</em>')
				} else if (batch == "特殊") {
					return val.replace(this.queryParams.school, '<em class="Tsseat">' + this.queryParams.school + '</em>')
				}
				return val.replace(this.queryParams.school, '<em class="Ptseat">' + this.queryParams.school + '</em>')
			}
			return val
		},

		introduce(row) {
			this.schoolIntroduce.data = row
			this.schoolIntroduce.open = true
		},

		tableTrClassName(row) {
			let batch = "普通";
			if (['本科提前单设', '本科提前平行', '高职专科提前'].includes(this.batch)) {
				batch = "提前";
			} else if (['一批特殊', '二批特殊'].includes(this.batch)) {
				batch = "特殊";
			}
			let name = batch + row.row.code + row.row.groupCode + 'school'
			return name;
		},

		details(row) {
			const infos = row;
			localStorage.setItem('infos', JSON.stringify(infos))
			const routeData = this.$router.resolve({
				name: 'school',
				params: {
					info: infos
				}
			})
			window.open(routeData.href, '_blank')
		},

		// 选志愿
		schemeChange(value, scope) {
			if (!value) {
				let findIndex = this.childrenData.findIndex(item => (item.schoolCode === scope.row.code && item.groupCode === scope.row.groupCode))
				if (findIndex !== -1) {
          // 重置childrenData数字
          this.childrenData.slice(findIndex + 1).map(item => {
            item.schemeNum = item.schemeNum - 1
          })
          this.childrenData.splice(findIndex, 1);
          // 重置tableList数字
          this.tableData
            .filter(item => item._schemeChecked === true)
            .filter(item => item.schemeNum >= scope.row.schemeNum)
            .forEach(item => {
              item.schemeNum = item.schemeNum - 1
            })
          // 清空
          scope.row.schemeNum = ''
				}
				this.schoolCheckedNumber = this.getSchoolCheckedNumber()
			} else {
				let maxChecked = 45
				if (this.tabs.active === '本科提前批平行') {
					maxChecked = 20
				} else if (this.tabs.active === '本科提前批单设' || this.tabs.active === '本科普通批单设') {
          maxChecked = 10
        }
				if (this.schoolCheckedNumber >= maxChecked) {
					this.$message.error(`最多只能选${maxChecked}个院校`)
					scope.row._schemeChecked = false
					return
				}

				let result = this.childrenData.find(item => (item.schoolCode === scope.row.code && item.groupCode === scope.row.groupCode))
        scope.row.schemeNum = this.childrenData.length + 1
				if (!result) {
					// 虚拟列表 el-table索引下标不再适用
					let index = this.tableData.findIndex(item => item.code === scope.row.code && item.groupCode === scope.row.groupCode)
					this.childrenData.push({
            "schemeNum": scope.row.schemeNum,
            "schemeName": this.tableData[index].schemeName,
						"schoolName": this.tableData[index].schoolName,
						"schoolCode": this.tableData[index].code,
						"plan2022": this.tableData[index].plan2022,
						"majorPlan": this.tableData[index].majorPlan,
						"num": this.programmes[0].num,
						"majorType": this.programmes[0].majorType,
						"stuId": this.user.id,
						"groupCode": this.tableData[index].groupCode,
						"recruitType": this.tableData[index].recruitType,
					})
				}
			}
			this.schoolCheckedNumber = this.getSchoolCheckedNumber()
		},

		// 选专业
		majorchange(parentRow, childRow, label) {
			let schoolItem = this.childrenData.find(item => (item.schoolCode == parentRow.code && item.groupCode == parentRow.groupCode))
			// 是否已选择该学校
			if (!schoolItem || !parentRow._schemeChecked) {
				return this.$message.error('请先选择学校');
			}

			if (label === "取消") {
				this.childrenData
					.filter(item => item.schemeName != null)
					.forEach((item, index) => {
						if (parentRow.code == item.schoolCode && parentRow.groupCode == item.groupCode) {
							let majorIndex = item.majorList.findIndex(child => child.majorCode === childRow.majorCode)
							if (majorIndex !== -1) {
								let deletedItem = item.majorList.splice(majorIndex, 1)
								this.majorDisabled.indexOf(deletedItem[0].sort) !== -1 && this.majorDisabled.splice(this.majorDisabled.indexOf(deletedItem[0].sort), 1)
							}
						}
					})
				childRow.sort = null
				childRow.majorName = childRow.majorName + ' '
				this.$set(childRow, 'sort', null)
			} else if (label === '备选') {
				if (!parentRow.schemeName.length) return
				this.childrenData
					.filter(item => item.schemeName != null)
					.forEach((item, index) => {
						if (parentRow.code == item.schoolCode && parentRow.groupCode == item.groupCode) {
							let majorIndex = item.majorList.findIndex(child => child === childRow.majorCode)
							item.majorList.splice(majorIndex, 1)
						}
					})
				this.childrenData.forEach(i => {
					if (parentRow.code == i.schoolCode && parentRow.groupCode == i.groupCode) {
						if (!i.majorList) {
							i.majorList = []
						}
						i.majorList.push({
							"sort": label,
							"majorName": childRow.majorName,
							"majorCode": childRow.majorCode,
							"plan2018": childRow.plan2018,
							"majorLimit": childRow.majorLimit
						})
						this.majorDisabled.push(label)
					}
				})
				this.$set(childRow, 'sort', label)
				childRow.sort = label
				childRow.majorName = childRow.majorName + ' '
			} else {
				if (!Array.isArray(schoolItem.majorList) || schoolItem.majorList.length === 0) {
					this.childrenData.forEach(i => {
						if (parentRow.code == i.schoolCode && parentRow.groupCode == i.groupCode) {
							if (!i.majorList) {
								i.majorList = []
							}
							i.majorList.push({
								"sort": label,
								"majorName": childRow.majorName,
								"majorCode": childRow.majorCode,
								"plan2018": childRow.plan2018,
								"majorLimit": childRow.majorLimit
							})
						}
					})
					this.$set(childRow, 'sort', label)
					this.majorDisabled.push(label)
					return
				}
				// majorList：专业列表
				else if (Array.isArray(schoolItem.majorList) && schoolItem.majorList.length > 0) {
					// step1.如果有相同的专业1 则清空sort
					parentRow.children1.map(item => {
						if (item.sort === label) {
							this.$set(item, 'sort', '')
							this.majorDisabled.indexOf(item.sort) !== -1 && this.majorDisabled.splice(this.majorDisabled.indexOf(item.sort), 1)
						}
					})
					// step2. 如果已经选了专业1 则删除schoolItem.majorList以前的专业1
					let sortIndex = schoolItem.majorList.findIndex(item => item.sort === label)
					if (sortIndex !== -1) {
						schoolItem.majorList.splice(sortIndex, 1);
						this.majorDisabled.indexOf(schoolItem.majorList[sortIndex].sort) !== -1 && this.majorDisabled.splice(this.majorDisabled.indexOf(schoolItem.majorList[sortIndex].sort), 1)
					}
					// 如果将专业1更改为专业2
					for (let z = 0; z < schoolItem.majorList.length; z++) {
						if (schoolItem.majorList[z].majorCode == childRow.majorCode) {
							schoolItem.majorList.splice(z, 1);
							this.majorDisabled.indexOf(childRow.sort) !== -1 && this.majorDisabled.splice(this.majorDisabled.indexOf(childRow.sort), 1)
						}
					}
					schoolItem.majorList = schoolItem.majorList || []
					schoolItem.majorList.push({
						"sort": label,
						"majorName": childRow.majorName,
						"majorCode": childRow.majorCode,
						"plan2018": childRow.plan2018,
						"majorLimit": childRow.majorLimit
					})
					this.$set(childRow, 'sort', label)
					this.majorDisabled.push(label)
					childRow.sort = label
					childRow.majorName = childRow.majorName + ' '
				}
			}
		},

		// 选专业 checkbox
		onChangeMajor(checkStatus, { parentRow, childRow }) {
			let label = '专业' // 专业默认名称
			if (!checkStatus) {
				this.childrenData
					.filter(item => item.schemeName != null)
					.forEach((item, index) => {
						if (parentRow.row.code == item.schoolCode && parentRow.row.groupCode == item.groupCode) {
							let majorIndex = item.majorList.findIndex(child => child === childRow.row.majorCode)
							item.majorList.splice(majorIndex, 1)
						}
					})
				childRow.row.sort = null
				childRow.row.majorName = childRow.row.majorName + ' '
				childRow.row._isChecked = false
			} else {
				let schoolItem = this.childrenData.find(item => (item.schoolCode == parentRow.row.code && item.groupCode == parentRow.row.groupCode))
				// 是否已选择该学校
				if (!schoolItem || !parentRow.row._schemeChecked) {
					childRow.row._isChecked = false
					return this.$message.error('请先选择学校');
				}
				if (!Array.isArray(schoolItem.majorList) || schoolItem.majorList.length === 0) {
					this.childrenData.forEach(i => {
						if (parentRow.row.code == i.schoolCode && parentRow.row.groupCode == i.groupCode) {
							if (!i.majorList) {
								i.majorList = []
							}
							i.majorList.push({
								"sort": label,
								"majorName": childRow.row.majorName,
								"majorCode": childRow.row.majorCode,
								"plan2018": childRow.row.plan2018,
								"majorLimit": childRow.row.majorLimit
							})
						}
					})
					this.$set(childRow.row, 'sort', label)
					childRow.row._isChecked = true
					return
				}
				// majorList：专业列表
				else if (Array.isArray(schoolItem.majorList) && schoolItem.majorList.length > 0) {
					schoolItem.majorList = schoolItem.majorList || []
					schoolItem.majorList.push({
						"sort": label,
						"majorName": childRow.row.majorName,
						"majorCode": childRow.row.majorCode,
						"plan2018": childRow.row.plan2018,
						"majorLimit": childRow.row.majorLimit
					})
					childRow.row.sort = label
					childRow.row.majorName = childRow.row.majorName + ' '
					childRow.row._isChecked = true
				}
			}
		},

		filterSaveScheme() {
			this.childrenData = this.childrenData.filter(item => ![null, undefined,''].includes(item.schoolCode))
			const res = new Map();
			//按照schoolCode和groupCode过滤
			this.childrenData = this.childrenData.filter((arr) => !res.has(arr.schoolCode+"_"+arr.groupCode) && res.set(arr.schoolCode+"_"+arr.groupCode, 1));
			let sortList = []
			let bList = []
			for (var i = 0; i < this.childrenData.length; i++) {
				if (this.childrenData[i].schemeName == "备选") {
					bList.push(this.childrenData[i])
				} else {
					sortList.push(this.childrenData[i])
				}
			}
			bList.forEach(i => {
				sortList.push(i)
			})
			this.childrenData = sortList
		},

		saveScheme() {
			this.tableData.filter(item => item.$v_expanded === true).forEach(item => {
				this.$refs.virtualScroll.toggleRowExpansion(item, false)
			})
			this.$refs.virtualScroll.update()
			this.filterSaveScheme()
			this.scheme = []
			if (this.childrenData != undefined && this.childrenData.length > 0) {
				console.log('this.childrenData', this.childrenData);
				this.childrenData.forEach(i => {
					this.scheme.push({
            ...i,
						"schoolName": i.schoolName,
						"schoolCode": i.schoolCode,
						"plan2022": i.plan2022,
						"majorPlan": i.majorPlan,
						"majorList": i.majorList ? JSON.stringify(i.majorList).toString() : null,
						"programmeName": this.programmes[0].programmeName,
						"schemeName": i.schemeName,
						"programmeId": this.programmes[0].programmeId,
						"stuId": this.user.id,
						"batch": this.programmes[0].batch,
						"num": i.num,
						"majorType": i.majorType,
						"groupCode": i.groupCode,
						"recruitType": i.recruitType,
					})
				})
			} else {
				this.$message({
					message: '保存成功！',
					type: 'success'
				});
				return;
			}
			request({
				method: 'post',
				url: 'stuSchemeV2/saveScheme',
				data: this.scheme
			}).then(res => {
				if (![0, 200].includes(res.code)) {
					return this.$message.error(res.msg)
				}
				this.$message.success('保存成功！')
				this.programmeId = res.data.list[0].programmeId
				this.xfa = res.data.list
				this.batch = res.data.list[0].batch
				this.num = res.data.list[0].num
				this.getTableData()
			})
		},

		handleClick() {
			this.saveScheme()
			if (this.programmes != null && this.programmes.length > 0) {
				const infos = this.programmes[0];
				localStorage.setItem('volunteer', JSON.stringify(infos))
				this.$router.push({
					name: 'designV2Preview',
					params: {
						info: infos
					}
				})
			} else {
				const infos = this.xfa[0];
				localStorage.setItem('infos', JSON.stringify(infos))
				this.$router.push({
					name: 'designV2Preview',
					params: {
						info: infos
					}
				})
			}
		},

		empty() {
			this.$confirm('此操作将清空所选的志愿, 是否继续?', '提示', {
				confirmButtonText: '确定',
				type: 'warning'
			}).then(() => {
				this.tableData.forEach(i => {
					i.schemeName = null
				})
				this.childrenData = []
				this.$message({
					type: 'success',
					message: '清空成功!'
				});
			})
		},

		UpperLevel() {
			let info = localStorage.getItem('stu')
			this.$confirm('保存当前方案嘛?', '提示', {
				confirmButtonText: '确定',
				cancelButtonText: '取消',
				type: 'warning'
			}).then(() => {
				this.saveScheme().then(
					this.$router.push({
						path: "/designV2/management",
						params: {
							info: info
						}
					})
				)
			}).catch(() => {
				this.$router.push({
					path: "/designV2/management",
					params: {
						info: info
					}
				})
			});
		},
		goTableTop () {
			this.$refs.virtualScroll.scrollTo(0)
		}

  }
}

</script>
<style lang="stylus" scoped>
.queryParams-row1__group
	/deep/
		.el-checkbox__input.is-checked .el-checkbox__inner
			background-color: #f96630;
			border-color: #f96630;
		.el-checkbox__input.is-checked+.el-checkbox__label
			color: #f96630;
		.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after
			border-color: #fff;
.ui-tbHeaderForm-elCheckbox /deep/ .el-checkbox__input.is-disabled + span.el-checkbox__label {
	color: #f96630;
}
</style>
<style lang="stylus" scoped>
createIconStyle(size, align = text-top) {
	width size
	height size
	vertical-align align
	flex-shrink 0
}
textLabelStyle() {
	font-size: 14px;
	color: #333;
	flex-shrink: 0;
	margin-right: 15px;
	// line-height: 34px;
}
.searchResult-currentCode {
  color #f00
}
.searchResult-icon {
  padding 2px
  &:hover {
    background #e1e5fa
    border-radius 4px
  }
}
.font-strong
	font-weight: bold;
.queryParams-row1
	display flex
	align-items: center;
	textLabelStyle()
	// line-height 1
	&__label
		margin-right 15px
		line-height: 1;
	&__group /deep/
		display flex
		align-items center
		.el-radio__input
			font-size: 14px;
		.el-radio__label
			font-size: 14px;
.el-icon-caret-bottom
	color #ccc
	font-size 10px
.icon-top
	color #39B830
.icon-bottom
	color #f56c6c
.icon-info
	createIconStyle(20px)
	cursor pointer
.page
	&-bd
		width BodyMaxWidth
		margin 0 auto 60px auto
		box-sizing border-box
	&-block
		uiBlock();
		padding 20px
		margin-bottom 20px
.breadcrumb
	font-size: 16px;
	font-weight: 400;
	color: #333333;
	padding 19px 23px 19px 23px
	.icon-home
		width 18px
		height 18px
		vertical-align: top;
		margin-right 5px

.el-icon-caret-right
	display none

.ui-tabs /deep/
	margin-right 40px
	--tabsPadding 10px
.collapse
	position relative
	&-ft
		position absolute
		bottom 0
		right 0
		width 100%
		pointer-events none
	&-tags
		margin-right 528px
		/deep/ .el-tag
			margin 10px 10px 0 0

#npt {
	position: fixed !important;
	right: 20px;
	top: 200px;
}

#npt button {
	color: white;
	width: 60px;
	height: 60px;
	border-radius: 50%;
	font-size: 15px;
	font-weight: initial;
	padding: 0;
	text-align: center;
}

#npt button span {
	display: inline-block;
	margin: auto;
}

.scheme{
	color: var(--primaryColor);
}
.not-scheme{
	color: #333;
}
</style>
